<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title>CanvasLayer</title>

<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=A0OfutRv1NeongaVeVIgUzC2bXsjdDIp"></script>
<script type="text/javascript" src="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script>
<link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />

<style type="text/css">
body, html,#container {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
</style>
</head>
<body>
    <div id="container"></div>
</body>
</html>
<script type="text/javascript">
window.onload=function(){
    alert(1)
}
	// // 百度地图API功能
	// var map = new BMap.Map("allmap");
	// var point = new BMap.Point(116.404, 39.915);
	// map.centerAndZoom(point, 15);


	// // 百度地图API功能
	// var map = new BMap.Map("allmap");
	// var point = new BMap.Point(116.404, 39.915);
	// map.centerAndZoom(point, 15);
	
    //重置地图显示区域及缩放大小
    var mp = new BMap.Map("container");
    mp.centerAndZoom(new BMap.Point(113.655202770192,34.72610550082871), 6);
    var point = new BMap.Point(113.655202770192,34.72610550082871);
    mp.enableScrollWheelZoom();
	// map.centerAndZoom(point, 15);

	// 编写自定义函数,创建标注
	function addMarker(point){
	  var marker = new BMap.Marker(point);
	  mp.addOverlay(marker);
	}
	// 随机向地图添加25个标注
	// var bounds = mp.getBounds();
	// var sw = bounds.getSouthWest();
    // var ne = bounds.getNorthEast();
    // console.log(this.sw)
	// var lngSpan = Math.abs(sw.lng - ne.lng);
	// var latSpan = Math.abs(ne.lat - sw.lat);
	// for (var i = 0; i < 25; i ++) {
	// 	var point = new BMap.Point(sw.lng + lngSpan * (Math.random() * 0.7), ne.lat - latSpan * (Math.random() * 0.7));
	// 	addMarker(point);
    // }
    //点击显示坐标
    // mp.addEventListener("click",function(e){
	// 	alert(e.point.lng + "," + e.point.lat);
	// });

    // 自定义添加注册点击事件
    var json_data = [[116.3964,39.9093],[113.655202770192,34.72610550082871],[114.30830680816631,30.587784800485455]];//获取自定义坐标
	var pointArray = new Array();
	for(var i=0;i<json_data.length;i++){
        var marker = new BMap.Marker(new BMap.Point(json_data[i][0], json_data[i][1])); // 创建点
        var circle = new BMap.Circle(point,10000,{strokeColor:"blue", strokeWeight:2, strokeOpacity:0.5}); //创建圆
        mp.addOverlay(marker);    //增加点
		pointArray[i] = new BMap.Point(json_data[i][0], json_data[i][1]);
        marker.addEventListener("click",attribute);//添加监听注册事件
	}
	//让所有点在视野范围内
	// mp.setViewport(pointArray);
    // 获取覆盖物位置
	function attribute(e){
        var p = e.target;
        mp.addOverlay(circle); //增加圆
		// alert("marker的位置是" + p.getPosition().lng + "," + p.getPosition().lat);    
	}
//自定义标注
    // var canvasLayer = new BMap.CanvasLayer({
    //     update: update
    // });

    // function update() {
    //     var ctx = this.canvas.getContext("2d");

    //     if (!ctx) {
    //         return;
    //     }

    //     ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);

    //     var temp = {};
    //     ctx.fillStyle = "rgba(50, 50, 255, 0.7)";
    //     ctx.beginPath();
    //     var data = [
    //         new BMap.Point(116.297047,39.979542),
    //         new BMap.Point(116.321768,39.88748),
    //         new BMap.Point(116.494243,39.956539)
    //     ];

    //     for (var i = 0, len = data.length; i < len; i++) {
    //         var pixel = mp.pointToPixel(data[i]);
    //         ctx.fillRect(pixel.x, pixel.y, 30, 30);
    //     }
    // }
    // mp.addOverlay(canvasLayer);
</script>
